<script setup>
  import { useRouter, useRoute } from 'vue-router'
  const router = useRouter()
  const goBack = () => {
    router.go(-1)
  }
  const goHome = () => {
    router.push('/')
  }
  const props = defineProps({
    title: {
      type: String,
      default: '标题'
    },
    showBack: {
      type: Boolean,
      default: true
    },
    type: {
      type: String,
      default: 'normal'
    }
  })
</script>

<template>
  <div class="header">
    <img
      src="/src/assets/img/home/back.png"
      class="back"
      @click="goBack"
      v-if="showBack && type === 'normal'"
    />
    <img
      src="/src/assets/img/home/home.png"
      class="home"
      @click="goHome"
      v-if="showBack && type === 'share'"
    />
    {{ title }}
  </div>
</template>

<style lang="scss" scoped>
  .back {
    position: absolute;
    height: 16px;
    width: 9px;
    left: 22px;
    top: 14px;
  }
  .home {
    position: absolute;
    height: 20px;
    width: 25px;
    left: 22px;
    top: 12px;
  }
  .header {
    width: 100%;
    height: 44px;
    font-family: PingFangSC, PingFang SC;
    font-weight: bold;
    font-size: 18px;
    color: #333333;
    line-height: 44px;
    text-align: center;
    position: relative;
  }
</style>
